import 'package:flutter/material.dart';
import 'package:flutter/src/foundation/key.dart';
import 'package:flutter/src/widgets/framework.dart';
import 'package:flutter/widgets.dart';

class CheckboxDemo extends StatefulWidget {
  const CheckboxDemo({Key? key}) : super(key: key);

  @override
  State<CheckboxDemo> createState() => _CheckboxDemoState();
}

class _CheckboxDemoState extends State<CheckboxDemo> {
  bool check = false;
  bool checka = false;
  bool checkb = false;
  bool checkc = false;
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title:const Text("Checkbox 复选框") ,
        centerTitle: true,
      ),
      body: Column(
        children: [
          Container(
            height: 100,
            margin: EdgeInsets.all(12),
            padding: EdgeInsets.all(20),
            color: Colors.grey[400],
            child:Row(
              children: [
                Checkbox(
                  value: check,  // true 选中状态
                  activeColor: Colors.blue, // 选中的颜色
                  // 状态回调
                  onChanged: (value){
                    setState(() {
                      check =! check;
                    });

                  }
                ),
                Text("请同意用户协议"),
              ],
            )
          ),
          Container(
            height: 100,
            margin: EdgeInsets.all(12),
            padding: EdgeInsets.all(20),
            color: Colors.grey[400],
            child: CheckboxListTile(
              secondary: Icon(Icons.home),
              title: Text("这是测试中"),
              subtitle: Text("这是二级标题"),
              value: checka,
              onChanged: (value){
                print("回调$value");
                setState(() {
                  checka = value!;
                });
              },
            ),
          ),
          Container(
            height: 100,
            margin: EdgeInsets.all(12),
            padding: EdgeInsets.only(left: 16),
            color: Colors.grey[400],
            // 手势监听
            child: GestureDetector(
              onTap: (){
                setState(() {
                  checkb=!checkb;
                });
              },
              child: Row(
                children: [
                  Image.asset(checkb?"assets/select.png":"assets/unselect.png",height: 25,width: 25,),
                  SizedBox(width: 12,),
                  Text("自定义复选框")
                ],
              ),
            ),
          ),
          Container(
            height: 100,
            margin: EdgeInsets.all(12),
            padding: EdgeInsets.only(left: 16),
            // 手势监听
            child: InkWell(
              onTap: (){
                setState(() {
                  checkc=!checkc;
                });
              },
              child: Row(
                children: [
                  Image.asset(checkc?"assets/select.png":"assets/unselect.png",height: 25,width: 25,),
                  SizedBox(width: 12,),
                  Text("自定义复选框")
                ],
              ),
            ),
          )

         
        ],
      ),
    );
    
  }
}